<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"> 
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <meta name="apple-mobile-web-app-capable" content="yes" />

        <!-- Base Css Files -->
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/jqueryui/ui-lightness/jquery-ui-1.10.4.custom.min.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/fontello/css/fontello.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/animate-css/animate.min.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/nifty-modal/css/component.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/magnific-popup/magnific-popup.css" rel="stylesheet" /> 
        <link href="__PUBLIC__/statics/coco-chat/assets/css/style.css" rel="stylesheet" type="text/css" />
        <link href="__PUBLIC__/statics/coco-chat/assets/css/style-responsive.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/pace/pace.css" rel="stylesheet" />
        <link href="__PUBLIC__/statics/coco-chat/assets/libs/jquery-notifyjs/styles/metro/notify-metro.css" rel="stylesheet" type="text/css" />
        
        <!-- Extra CSS Files -->
      	<link href="__PUBLIC__/statics/coco-chat/assets/libs/jquery-icheck/skins/all.css" rel="stylesheet" />
        
        <!-- Custom Css Files -->
        <link href="__HOME_CSS__/style.css"  rel="stylesheet" />
    </head>
    <body>
    
	<div>
		<div class="sub-header-title">
	        <h2>订单确认</h2>
	    </div>
	    <div class="row">
			<div class="col-sm-8"><h3>收货地址</h3></div>
			<div class="col-sm-4 pull-right">
		   		<h4 class="text-right"><a href="javascript:;" class="add_addr">添加地址</a></h4>
		   	</div>
		</div>
		<div class="content-wrap">
        	<table id="datatables-1" class="table table-striped table-bordered" cellspacing="0" width="100%">
           		<tbody id="addrtbody">
                	<volist name="address_list" id="vo">
            		<tr data-id="{$vo['id']}">
                        <td><input type="radio" name="address" value="{$vo['id']}" <if condition="$vo['is_default'] eq 1">checked</if> /></td>
                        <td><label>{$vo['receiver']}</label><span class="is_default red"><if condition="$vo['is_default'] eq 1">【默认】</if></span>
                        </td>
                        <td>{$vo['phone']}</td>
                        <td>{$vo['address']}</td>
                        <td class="address-option">
                            <a href="{:U('Mall/editAddress',array('id'=>$vo['id'],'type'=>'mall'))}">修改</a> |
                            <a class="del-address" href="javascript:;">删除</a>
							<if condition="$vo['is_default']=='0'">
								<a class="set-default" href="javascript:;">| 设为默认</a>
                          	</if>
                   		</td>
                	</tr>
            		</volist>
				</tbody>
			</table>
			<if condition="count($address_list) gt 3">
				<p class="text-center">
					<a id="allshow" href="javascript:;">▼展开所有</a>
					<a id="hidetr" href="javascript:;">▲收起地址</a>
				</p>
			</if>
		</div>
		<div class="row">
			<div class="col-sm-8"><h3>订单信息</h3></div>
			<div class="col-sm-4 pull-right">
		   		<h4 class="text-right"><a href="{:U('Mall/cart')}">修改购物车</a></h4>
		   	</div>
		</div>
		<div class="widget">
			<table class="table table-bordered table-striped" style="clear: both">
         		<thead>
              		<tr>
                       	<th>商品</th>
                       	<th>单价</th>
                       	<th>数量</th>
                   	</tr>
               	</thead>
       			<tbody>
       				<volist name="list" id="vo">
                    	<tr data-id="{$vo['id']}" class="cart-li">
                           	<td>
                           		<span><img src="{$vo['pic_url']}" width="80" style="margin-right:10px;"/></span>
                           		<a href="{:U('detail',array('id'=>$vo['goods_id']))}">{$vo['title']}</a><br/>
                           	</td>
                          	<td>
                          		{$currency_symbol}<span class="price-tb">{$vo['new_price']}</span>
                          	</td>
                           	<td>
                           		{$vo['quantity']}
                           	</td>
                   		</tr>
                   	</volist>
          		</tbody>
          	</table>
          	
          	<p><h3>订单备注</h3></p>
		    <p><textarea placeholder="100个字符以内" maxlength="100" class="form-control" rows="3" name="remark"></textarea></p>
		    <p>
		    	<h3>订单总计</h3>
		    	<span>
			    	总计：{$currency_symbol}{$total}<br/>
			    	运费方式：{$shipping_mode}<br/>
			    	<if condition="$shipping GT 0">
	                	运费金额：{$currency_symbol}{$shipping}
	               	</if>
				</span>
		    </p>
		    <p class="text-center"> 
		   		<a id="orderBtn" class="btn btn-success" href="javascript:;">提交订单</a>
		    </p>
		</div>
	</div>

	<!-- Base Js Files -->
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery/jquery-1.11.1.min.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/bootstrap/js/bootstrap.min.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jqueryui/jquery-ui-1.10.4.custom.min.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-ui-touch/jquery.ui.touch-punch.min.js"></script>
 	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-detectmobile/detect.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/fastclick/fastclick.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-slimscroll/jquery.slimscroll.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/nifty-modal/js/classie.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/nifty-modal/js/modalEffects.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-notifyjs/notify.min.js"></script>
    <script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-notifyjs/styles/metro/notify-metro.js"></script>
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/pace/pace.min.js"></script>
	
	<!-- Extra Js Files -->
	<script src="__PUBLIC__/statics/coco-chat/assets/libs/jquery-icheck/icheck.min.js"></script>
	
	<!-- Custom Js Files -->
	<script src="__HOME_JS__/common.js"></script>
	<script>
    	//ICHECK
	    $('input').iCheck({
	        radioClass: 'iradio_minimal-green',
	        increaseArea: '20%' // optional
	    });
    	
	  	//绑定添加地址
        $('.add_addr').click(function(){
			// 用ajax获取信息
	      	$.post("{:U('Mall/isCanAddAddress')}", '', function(response) {
	      		if(response.status){
	      			location.href = "{:U('Mall/addAddress')}?type=mall";
				}else{
					window.parent.layer.msg(response.message);
				}
	        }, 'json');
        });
	  	
      	//地址的展示的初始化
        $('#hidetr').hide();
        $.each($("#datatables-1 tr"), function(i){ 
            if(i > 2){ $(this).hide();} 
        });
      	//地址显示全部
        $('#allshow').click(function(){
            $("#datatables-1 tr").show();
            $(this).hide();
            $('#hidetr').show();
        });
      	//地址部分隐藏
        $('#hidetr').click(function(){
            $('#allshow').show();
            $(this).hide();
            $.each($("#datatables-1 tr"), function(i){ 
                if(i > 2){$(this).hide();} 
            });
        });
        
      	//设置默认
        $('.set-default').bind('click', setDefault);
        function setDefault(){
        	var parent_tr = $(this).parents("tr")
            var id = parent_tr.data('id');
            var data = {
					'id'	: id
			};
			// 用ajax提交表单
	      	$.post("{:U('Mall/setAddress')}", data, function(response) {
	      		//根据请求相应状态提示通知
	       		if(response.status){
	       			$('#datatables-1 .set-default').remove();
	       			$('#datatables-1 .address-option').append('<a class="set-default" href="javascript:;">| 设为默认</a>');
                    $('#datatables-1 .is_default').html('');
                    parent_tr.find('.set-default').remove();
					parent_tr.find('.is_default').html('【默认】');
					$('.set-default').bind('click', setDefault);
					parent_tr.find('input[type=radio]').iCheck('check');
				}
	        }, 'json');
        }
        
      	//删除选中地址
        $('.del-address').click(function(){
        	var parent_tr = $(this).parents("tr")
            var id = parent_tr.data('id');
        	window.parent.layer.confirm('确认删除该地址吗？',{
                btn: ['确认','取消'], //按钮
            },function(index){
            	// 用ajax提交表单
    	      	$.post("{:U('Mall/delAddress')}", {'id': id}, function(response) {
    	      		//根据请求相应状态提示通知
    	       		if(response.status){
    					parent_tr.remove();
    					if ($("#datatables-1 tr").length<=3){
    						$('#hidetr').hide();
    					}
    				}
    	       		window.parent.layer.close(index);
    	        }, 'json');
            });
        });

      	//确认下单处理
        $('#orderBtn').click(function(){
        	//验证收货地址
			var address_id = $("#datatables-1 input[name='address']:checked").val();
			if(!address_id){
         		window.parent.layer.msg('请先选择收货地址');
         		return false;
        	}
			//验证下单商品
			var goods_ids = new Array();
			$('tr.cart-li').each(function(index){
				goods_ids.push($(this).data('id'));
	    	});
			if(!goods_ids){
         		window.parent.layer.msg('请先选择下单商品');
         		return false;
        	}
			//ajax提交订单
       		window.parent.layer.confirm('确认提交订单吗？', {
       			btn: ['确认','取消'], //按钮
       		}, function(index){
                //开启数据处理提示
                var load = window.parent.layer.msg('订单提交中。。。', {
                          		icon: 16,
                              	shade: 0.5,
                              	time: 0,
                            });
                
             	// 用ajax提交表单
             	var data = {
                        'goods_ids'	: goods_ids,
                        'address_id': address_id,
                        'remark'	: $("textarea[name='remark']").val(),
               	};
             	
		      	$.post('{:U('Mall/order')}', data, function(response) {
		      		//关闭数据处理提示
                    window.parent.layer.close(load);
                    //弹出提示
                    window.parent.layer.msg(response.message);

                    if(response.status){
                      	//询问框
                        window.parent.layer.confirm('下单成功', {
                            btn: ['去商城继续购物','查看订单'], //按钮
                        }, function(index){
                            location = "{:U('Mall/goods')}";
                            window.parent.layer.close(index);
                        }, function(index){
                            location = "{:U('Mall/orderList')}";
                            window.parent.layer.close(index);
                        });
                      
                    }else {
                        notify('error',response.message);
                        location = "{:U('Mall/cart')}";
                    }
		        }, 'json');
                     
                //关闭确认对话框
                window.parent.layer.close(index);
            }, function(index){
                //关闭确认对话框
                window.parent.layer.close(index);
            });
		 }) ;
	</script>
	</body>
</html>